// 暴露出去一个实例化的 vue-router 的路由实例对象

// 引入 Vue 核心
import Vue from "vue";

// 引入 vue-router 插件
import VueRouter from "vue-router";

// 引入 nprogress
import NProgress from "nprogress";
import "nprogress/nprogress.css";

// 引入定义好的路由组件 views 文件中写的组件 @ => src
import HelloHome from "@/views/HelloHome";
import HelloAbout from "@/views/HelloAbout";

// 注册 vue-router 插件
Vue.use(VueRouter);

// 实例化 路由实例对象
const router = new VueRouter({
  // 配置选项

  // 路由规则集合
  routes: [
    {
      // 一条规则, 一条路由信息
      path: "/home",
      name: "abc", // 命名路由 具有名字的路由 给当前规则取个名字  跳转可以使用 name
      component: HelloHome,
    },
    {
      // 一条规则, 一条路由信息
      path: "/about",
      name: "about", // 命名路由 具有名字的路由 给当前规则取个名字  跳转可以使用 name
      component: HelloAbout,
    },
  ],
});

// beforeEach  全局前置
//    跳转之前执行
router.beforeEach((to, from, next) => {
  NProgress.start();
  console.log("beforeEach");
  next();
});

// afterEach   全局后置
//    跳转完成执行   它没有 next 函数
router.afterEach(() => {
  NProgress.done();
  console.log("afterEach");
});

// 暴露
export default router;
